@import "../../public/less/index.less";
body {
    background-color: #f4f4f4;
    font-family: 'PingFang SC', 'STHeitiSC-Light', 'Helvetica-Light', arial, sans-serif, 'Droid Sans Fallback';
}

.login{
    display: inline-block;
}
.glo{
    height: 100%;
    width: 100%;
    padding: 0px;
    margin: 0px;
    top: 0px;
    .head {
        display: flex;
        background-color: #fff;
        .padding(0,30);
        position: fixed;
        z-index: 10;
        right: 0px;
        left: 0px;
        .h(102);
        top: 0px;
        label {
            .mt(26);
            display: inline-block;
            .navi {
                background-image: url("../../public/images/nav.png");
                background-size: cover;
                .w(37);
                .h(32);
                display: inline-block;
                .mt(8);
                .mr(20);
            }
        }
        .seacher {
            display: inline-block;
            width: 100%;
            .b-radius(26);
            .mt(26);
            .input-search {
                background-image: url(../../public/images/search.png);
                background-size: cover;
                width: 0.36rem;
                height: 0.37333333rem;
                display: inline-block;
                position: absolute;
                .left(110);
                .top(38);
            }
            input[type="search"] {
                .b-radius(26);
                //border: 0px solid #E8E8E8;
                .h(52);
                .fs(26);
                width: 100%;
                .pl(60);
                background-color: #FFFFFF;
                .border-solid(1,#E8E8E8);
            }
        }
    }
    .swiper {
        position: relative;
        .mt(102);
        .swiper-container {
            margin: 0 auto;
            position: relative;
            overflow: hidden;
            z-index: 1;
            .h(325);
            .swiper-wrapper {
                .swiper-slide {
                    img {
                        width: 100%;
                    }
                }
            }
        }
    }
    .content {
        position: relative;
        .mb(103);
        width: 100%;
        .tab {
            height: 60px;
            position: relative;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            align-items: center;
            padding: 0 30px;
            background-color: #ffffff;
            color: #333333;
            .fs(26);
            .tab1 {
                flex: 1;
                text-align: center;
            }
            .tab1.active span {
                color: #00c4d2;
                .border-bottom(6 , #00c4d2);
                .pb(10);
                padding-left: 0px;
                padding-right: 0px;
            }
            .tab2 {
                flex: 1;
                text-align: center;
            }
            .tab2.active span {
                color: #00c4d2;
                .border-bottom(6 , #00c4d2);
                .pb(10);
                padding-left: 0px;
                padding-right: 0px;
            }
            .tab3 {
                flex: 1;
                text-align: center;
            }
            .tab3.active span {
                color: #00c4d2;
                .border-bottom(6 , #00c4d2);
                .pb(10);
                padding-left: 0px;
                padding-right: 0px;
            }
        }
        .tab1-cont {
            display: block;
            background-color: #FFFFFF;
            width: 100%;
            .mt(20);
            .mui-scroll-wrapper {
                position: relative;
                z-index: 2;
                .mui-scroll {
                    position: relative;
                    z-index: 0;
                }
            }
            div#spinner{
                width:100%;
                text-align:center;
                color:#919191;
                .fs(30);
                .h(60);
            }
            ul{
                li {
                    display: block;
                    .play-more {
                        display: inline-block;
                        text-align: center;
                        position: absolute;
                        z-index: 10;
                        background-image: url("../../public/images/play.png");
                        background-size: cover;
                        .h(120);
                        .w(120);
                        .ml(315);
                        .mt(150);
                    }
                    .e-video {
                        position: relative;
                        width: 100%;
                        display: flex;
                        img {
                            .h(422);
                            width: 100%;
                            background-size: cover;
                        }

                    }
                    .specifica-goods {
                        //.h(140);
                        position: relative;
                        .padding(20,25);
                        left: 0px;
                        right: 0px;
                        .goods-title {
                            color: #919191;
                            .fs(20);
                            text-align: left;
                        }
                        .goods-detail {
                            position: relative;
                            //.top(30);
                            align-items: center;
                            display: flex;
                            .h(60);
                            .goods-price {
                                position: absolute;
                                left: 0px;
                                .reality-goods-price {
                                    .fs(25);
                                    color: #FF6C6C;
                                }
                                .original-goods-price {
                                    .fs(20);
                                    color: #B2B2B2;
                                    text-decoration: line-through;
                                }
                            }
                            .add-icon {
                                position: absolute;
                                .right(0);
                                .add-cart{
                                    background-image: url(../../public/images/addCart.png);
                                    background-size: cover;
                                    .h(50);
                                    .w(50);
                                    display: inline-block;
                                }
                                .selec-details {
                                    background-image: url(../../public/images/shopping.png);
                                    background-size: cover;
                                    .h(50);
                                    .w(50);
                                    display: inline-block;
                                    margin-left: 10px;
                                }
                            }
                        }
                    }
                }
            }
        }
        .tab2-cont {
            display: none;
            width: 100%;
            .mt(20);
            .goods-model {
                .fs(20);
                display: flex;
                color: #919191;
                .h(109);
                align-items: center;
                background-color: #FFFFFF;
                .pl(25);
                .swiper-slide {
                    text-align: center;
                }
                .swiper-slide.swiper-slide-active.active {
                    display: inline-block;
                    text-align: center;
                    background-color: #00c4d2;
                    color: #fff;
                    .b-radius(10);
                    align-items: center;
                    .padding(10,0);
                }
                .swiper-slide.swiper-slide-next.active {
                    display: inline-block;
                    text-align: center;
                    background-color: #00c4d2;
                    color: #fff;
                    .b-radius(10);
                    align-items: center;
                    .padding(10,0);
                }
                .swiper-slide.active {
                    display: inline-block;
                    text-align: center;
                    background-color: #00c4d2;
                    color: #fff;
                    .b-radius(10);
                    align-items: center;
                    .padding(10,0);
                }
            }
            .goods-brand {
                .mt(20);
                width: 100%;
                background-color: #FFFFFF;
                overflow: hidden;
                .title {
                    display: flex;
                    align-items: center;
                    .h(78);
                    .padding(0, 25);
                    .img-title {
                        //.mt(27);
                        display: inline-block;
                        left: 0px;
                        background-image: url("../../public/images/titlehint.png");
                        background-size: cover;
                        .w(8);
                        .h(26);
                    }
                    .title-name {
                        display: inline-block;
                        left: 0px;
                        //.mt(27);
                        .fs(26);
                        .ml(10);
                    }
                    .more-brand {
                        display: block;
                        position: absolute;
                        float: right;
                        right: 0px;
                        .mr(25);
                        .fs(16);
                        .h(78);
                        .mt(25);
                        color: #919191;
                        .more-brand-hint {
                            //display: inline-block;
                            //background-image: url("../../public/images/selectmore.png");
                            //background-size: cover;
                            //.h(14);
                            //.w(16);
                            //.ml(10);
                        }
                    }
                    #packup {
                        display: none;
                        position: absolute;
                        float: right;
                        .right(25);
                        .mt(25);
                        .w(100);
                        .h(30);
                        .pack-up {
                            position: absolute;
                            float: right;
                            .right(0);
                            background-image: url("../../public/images/packup.png");
                            background-size: cover;
                            .h(12);
                            .w(22);
                        }
                    }
                }
                .brand-list {
                    display: inline-block;
                    text-align: left;
                    .w(750);
                    .pl(40);
                    .brand-list-img {
                        img {
                            display: inline-block;
                            .w(110);
                            .h(150);
                            .margin(26, 26);
                        }
                    }

                }
                .swiper-container {
                    .mt(20);
                    position: relative;
                    overflow: hidden;
                    z-index: 1;
                    .h(260);
                    .swiper-wrapper {
                        .swiper-slide {
                            img {
                                width: 100%;
                            }
                        }
                    }
                }
                ul {
                    .mt(20);
                    overflow: hidden;
                    li {
                        float: left;
                        width: 50%;
                        margin-left: -1px;
                        .mb(20);
                        .padding(0, 20);
                        overflow: hidden;
                        box-sizing: border-box;
                        .play-more {
                            display: inline-block;
                            text-align: center;
                            position: absolute;
                            z-index: 10;
                            background-image: url("../../public/images/play.png");
                            background-size: cover;
                            .h(120);
                            .w(120);
                            .ml(315);
                            .mt(150);
                        }
                        .e-video {
                            position: relative;
                            width: 100%;
                            img {
                                width: 100%;
                                background-size: cover;
                                .h(330);
                            }

                        }
                        .specifica-goods {
                            position: relative;
                            .padding(20,0);
                            left: 0px;
                            right: 0px;
                            .h(100);
                            .goods-title {
                                color: #919191;
                                .fs(16);
                                text-align: left;
                            }
                            .goods-detail {
                                position: relative;
                                .mt(28);
                                align-items: center;
                                display: flex;
                                .goods-price {
                                    position: absolute;
                                    left: 0px;
                                    .reality-goods-price {
                                        .fs(20);
                                        color: #FF6C6C;
                                    }
                                    .original-goods-price {
                                        .fs(15);
                                        color: #B2B2B2;
                                        text-decoration: line-through;
                                    }
                                    .original-goods-price1 {
                                        position: absolute;
                                    }
                                }
                                .add-icon {
                                    position: absolute;
                                    .right(0);
                                    .add-cart{
                                        background-image: url(../../public/images/ppgcart.png);
                                        background-size: cover;
                                        .h(40);
                                        .w(40);
                                        display: inline-block;
                                    }
                                    .selec-details {
                                        background-image: url(../../public/images/ppgshopping.png);
                                        background-size: cover;
                                        .h(40);
                                        .w(40);
                                        display: inline-block;
                                        .ml(30);
                                    }
                                }
                            }
                        }
                    }
                }
            }

        }
    }
}

* {
    margin: 0;
    padding: 0;
}